<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>开始使用layui</title>
    <link rel="stylesheet" href="layui/css/layui.css">
    <link href="css/city.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="css/transactionCenter.css">
    <link rel="stylesheet" href="css/mycenter.css">
    <link rel="stylesheet" href="css/common.css">
</head>

<body>
    <!-- 你的HTML代码 -->
    <header>
        <div class="logo">
            三位一体报名系统
        </div>
        <div class="nav">
            <span class="layui-breadcrumb" lay-separator="|">
              <a><span>欢迎您：XXX</span></a>
              <a href="">退出</a>
            </span>
        </div>
    </header>
    <div class="content">
        <div class="main-nav">
            <h3 class="title">用户中心</h3>
            <div>
                <a href="home.html">
                    <div class="nav-title-link">
                        <div class="wrap">
                            <span class="iconfont icon-gerenzhongxin left"></span>
                            <span class="nat-title-txt">个人信息</span>
                        </div>
                    </div>
                </a>
                <a href="joinTest.html">
                    <div class="nav-title-link show">
                        <div class="wrap">
                            <span class="iconfont icon-diban- left"></span>
                            <span class="nat-title-txt">我要报考</span>
                        </div>
                    </div>
                </a>
                <a href="progress.html">
                    <div class="nav-title-link">
                        <div class="wrap">
                            <i class="layui-icon left">&#xe60e;</i>
                            <span class="nat-title-txt">进度查询</span>
                        </div>
                    </div>
                </a>
                <a href="print.html">
                    <div class="nav-title-link">
                        <div class="wrap">
                            <i class="layui-icon left">&#xe639;</i>
                            <span class="nat-title-txt">打印准考证</span>
                        </div>
                    </div>
                </a>
                <a href="count.html">
                    <div class="nav-title-link">
                        <div class="wrap">
                            <i class="layui-icon left">&#xe620;</i>
                            <span class="nat-title-txt">账号管理</span>
                        </div>
                    </div>
                </a>
            </div>
        </div>
        <div class="main-container" style="background-color: white;">
            <div style="clear: both"></div>
            <div class="layui-tab-content" style="font-size: 14px">
                <div class="layui-tab-item layui-show" style="min-height: 600px; padding: 15px">
                    <fieldset class="layui-elem-field layui-field-title site-title">
                        <legend><span class="iconfont icon-diban-"></span></span><span name="docend" style="font-size: 16px">我要报考</span></legend>
                    </fieldset>
                       <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                          <ul class="layui-tab-title">
                            <li class="layui-this">三位一体</li>
                            <li>高水平运动员</li>
                          </ul>
                          <div class="layui-tab-content">
                            <div class="layui-tab-item layui-show">
                                <form class="layui-form formMessage" action="" >
                                    <table class="layui-table">
                                        <tbody>   
                                            <tr> 
                                                <td class="members" colspan="2" rowspan="4" >会考成绩</td>
                                                <td >语文</td>
                                                <td>
                                                    <select name="city" lay-verify="">
                                                      <option value="0" selected>A</option>
                                                      <option value="1">B</option>
                                                      <option value="2">C</option>
                                                    </select>
                                                </td>
                                                <td colspan="1">历史</td>
                                                <td colspan="2">
                                                    <select name="city" lay-verify="">
                                                      <option value="0" selected>A</option>
                                                      <option value="1">B</option>
                                                      <option value="2">C</option>
                                                    </select>
                                                </td>
                                                <td colspan="2">化学</td>
                                                <td colspan="2">
                                                    <select name="city" lay-verify="">
                                                      <option value="0" selected>A</option>
                                                      <option value="1">B</option>
                                                      <option value="2">C</option>
                                                    </select>
                                                </td>
                                            </tr>
                                            <tr> 
                                                <td >数学</td>
                                                <td>
                                                    <select name="city" lay-verify="">
                                                      <option value="0" selected>A</option>
                                                      <option value="1">B</option>
                                                      <option value="2">C</option>
                                                    </select>
                                                </td>
                                                <td colspan="1">地理</td>
                                                <td colspan="2">
                                                    <select name="city" lay-verify="">
                                                      <option value="0" selected>A</option>
                                                      <option value="1">B</option>
                                                      <option value="2">C</option>
                                                    </select>
                                                </td>
                                                <td colspan="2">技术</td>
                                                <td colspan="2">
                                                    <select name="city" lay-verify="">
                                                      <option value="0" selected>A</option>
                                                      <option value="1">B</option>
                                                      <option value="2">C</option>
                                                    </select>
                                                </td>
                                            </tr>
                                            <tr> 
                                                <td >英语</td>
                                                <td>
                                                    <select name="city" lay-verify="">
                                                      <option value="0" selected>A</option>
                                                      <option value="1">B</option>
                                                      <option value="2">C</option>
                                                    </select>
                                                </td>
                                                <td colspan="1">地理</td>
                                                <td colspan="2">
                                                    <select name="city" lay-verify="">
                                                      <option value="0" selected>A</option>
                                                      <option value="1">B</option>
                                                      <option value="2">C</option>
                                                    </select>
                                                </td>
                                                <td colspan="2">折算成绩<br>（A计10分B计5分）</td>
                                                <td colspan="2">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                            </tr>
                                            <tr> 
                                                <td >政治</td>
                                                <td>
                                                    <select name="city" lay-verify="">
                                                      <option value="0" selected>A</option>
                                                      <option value="1">B</option>
                                                      <option value="2">C</option>
                                                    </select>
                                                </td>
                                                <td colspan="1">生物</td>
                                                <td colspan="2">
                                                    <select name="city" lay-verify="">
                                                      <option value="0" selected>A</option>
                                                      <option value="1">B</option>
                                                      <option value="2">C</option>
                                                    </select>
                                                </td>
                                                <td colspan="2"></td>
                                                <td colspan="2">                                                   
                                                </td>
                                            </tr>    
                                            <tr> 
                                                <td class="study_experience" rowspan="6" colspan="2">学习经历</td>
                                                <td colspan="2">何年何月至何年何月</td>
                                                <td colspan="2">在何学校或单位</td>
                                                <td colspan="3">任何职</td>
                                                <td colspan="3">证明人</td>
                                            </tr>
                                            <tr class="experience">
                                                <td colspan="2">
                                                    <input type="text" name="title" class="layui-input">
                                                </td>
                                                <td colspan="2">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                                <td colspan="3">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                                <td colspan="3">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                            </tr>
                                             <tr class="experience">
                                                <td colspan="2">
                                                    <input type="text" name="title" class="layui-input">
                                                </td>
                                                <td colspan="2">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                                <td colspan="3">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                                <td colspan="3">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                            </tr>
                                             <tr class="experience">
                                                <td colspan="2">
                                                    <input type="text" name="title" class="layui-input">
                                                </td>
                                                <td colspan="2">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                                <td colspan="3">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                                <td colspan="3">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                            </tr>
                                             <tr class="experience">
                                                <td colspan="2">
                                                    <input type="text" name="title" class="layui-input">
                                                </td>
                                                <td colspan="2">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                                <td colspan="3">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                                <td colspan="3">
                                                   <input type="text" name="title" class="layui-input">
                                                </td>
                                            </tr>
                                            <tr>
                                              <td colspan="11" align="center" onclick="addInput()">
                                                  <a class="layui-icon" href="javascript:;" onclick="addInput()">&#xe654;</a>
                                              </td>
                                            </tr>
                                            <tr> 
                                                <td class="members" colspan="2">奖惩情况</td>
                                                <td colspan="10">
                                                    <textarea name="desc" placeholder="请输入内容" class="layui-textarea"></textarea>
                                                </td>                                              
                                            </tr>

                                        </tbody>
                                    </table>
                                    <div style="text-align: center;">                     
                                      <button class="layui-btn" lay-submit lay-filter="formDemo">提交</button>
                                      <button type="reset" class="layui-btn layui-btn-primary">保存</button>  
                                    </div>
                                </form>
                            </div>
                            <div class="layui-tab-item">
                               <form class="layui-form formMessage" action="" >
                                <table class="layui-table">
                                    <tbody>
                                        <tr>
                                            <td colspan="2">报考专业</td>
                                            <td colspan="10"><input type="text" name="" class="layui-input"></td>
                                        </tr>
                                        <tr>
                                            <td rowspan="2" colspan="2">体育特长<br>指导老师</td>
                                            <td colspan="3">姓名</td>
                                            <td colspan="4">单位</td>
                                            <td colspan="3">联系电话</td> 
                                        </tr>
                                        <tr>
                                            <td colspan="3">
                                                <input type="text" name="title" class="layui-input">
                                            </td>
                                            <td colspan="4">
                                                <input type="text" name="title" class="layui-input">
                                            </td>
                                            <td colspan="3">
                                                <input type="text" name="title" class="layui-input">
                                            </td> 
                                        </tr>
                                        <tr>
                                            <td rowspan="2" colspan="2">参赛及获奖情况</td>
                                            <td colspan="10">请注明时间，主板单位级别和获奖情况</td>
                                        </tr>
                                        <tr>
                                            <td colspan="10">
                                                 <textarea name="desc" placeholder="请输入内容" class="layui-textarea"></textarea>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td rowspan="2" colspan="2">学校对学生的综合评定</td>
                                            <td colspan="10">
                                                <textarea name="desc" placeholder="请输入内容" class="layui-textarea"></textarea>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                                <div style="text-align: center;">                     
                                      <button class="layui-btn" lay-submit lay-filter="formDemo">提交</button>
                                      <button type="reset" class="layui-btn layui-btn-primary">保存</button>  
                                </div>
                              </form>
                            </div>
                          </div>
                        </div> 
                   
                </div>
            </div>
        </div>
    </div>
    <script src="layui/layui.js"></script>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/city.min.js"></script>
    <script>

    function addInput() {
        var len = $(".experience").length;
        console.log(len)
        $(".study_experience").attr({
            rowspan: len + 3,
        });
        $(".experience:last").after('<tr class="experience"><td> <input type="text" name="title" required lay-verify="required" autocomplete="off" class="layui-input"></td><td colspan="2"> <input type="text" name="title" required lay-verify="required" autocomplete="off" class="layui-input"></td><td colspan="2"> <input type="text" name="title" required lay-verify="required" autocomplete="off" class="layui-input"></td><td> <input type="text" name="title" required lay-verify="required" autocomplete="off" class="layui-input"></td></tr>')
    }
    //一般直接写在一个js文件中
    layui.use(['layer', 'form', 'element', 'laydate'], function() {
        var layer = layui.layer;
        //layer.msg('Hello World');
        var form = layui.form;
        var element = layui.element;
        var carousel = layui.carousel;
        var laydate = layui.laydate;

        laydate.render({
            elem: '#test1' //指定元素
        });


    });
    </script>
</body>

</html>